Expressive Design Systems by Yesenia Perez-Cruz

Author:Yesenia Perez-Cruz
Language: eng
Format: mobi, epub, pdf
Publisher: A Book Apart
Published: 2019-11-12T02:21:08+00:00

Even though we won’t know all the ways components will be used to build pages, we can have harmonious layouts if our levers and dials are in tune. Let’s take a look at how to set them.

Making global design decisions

By manipulating the four levers—size, scale, density, and weight—we can have enormous, sweeping impact on the look and feel of our layouts (Fig 3.10):

Size: What size are the elements on the page? Should they be large or small? This choice ties back to the purpose of your product and what your audience expects to be able to do. Do you want someone to take their time consuming all of your content, focusing on one thing at a time? Choose larger elements that take up more room. Or, do you want someone to quickly see every action they can take at a glance? Choose smaller elements. Size primarily impacts the speed at which your content is consumed.

Scale: What size are elements relative to one another? Should there be a more dramatic size contrast between elements, or should everything feel similarly sized? Again, this ties back to purpose, audience expectation, and design principles. Scale is used to focus attention. If you want to guide your audience through a process, you need more pronounced size contrast that points to one primary action. This makes your audience feel more supported in their journey. If you want your audience to choose their own path, then use less contrast to highlight that there are multiple paths to choose from. Your audience will feel more empowered to make a decision. Scale primarily involves how you use size to focus attention.

Density and weight: How dense is the page? Should it feel airy or compact? Density and weight are related, but not identical: density refers to how tightly packed your elements are, while weight refers to the overall heaviness of a page. While density is primarily communicated through space, weight is communicated through typography and color. A page with lots of space between elements will feel airier than a page with tightly packed elements. A page with dark headers and bold, compact fonts will feel heavier than a page with delicate fonts and light colors.

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.